<template>
  <view class="wallet">
    <view class="wallet-box">
      <view class="wa-top">
        <view class="wa-top-left">
          <view class="wa-top-left-num">9685.00</view>
          <view class="wa-top-left-title">我的余额</view>
        </view>
        <view class="wa-top-right" @click="gobalan" >余额明细</view>
      </view>
      <view class="wa-cent">
        <view class="wa-cent-title">电豆金额</view>
        <view class="wa-cent-item">
          <view class="wac-item" v-for="(item,index) in cz" :key="index">
            <view class="wac-item-top">
              <view class="w-f">￥</view>
              <view class="w-y">{{ item.num }}</view>
            </view>
            <view class="wac-item-bot">{{ item.title }}</view>
          </view>
        </view>
        <view class="wa-bottom">
          <uv-button text="确认充值" shape="circle" color="#008c8c" ></uv-button>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup>
import { ref} from 'vue'
const cz=ref([
  {num:'10',title:'送5元'},
  {num:'20',title:'送10元'},
  {num:'20',title:'送10元'},
  {num:'20',title:'送10元'},
  {num:'20',title:'送10元'},
  {num:'20',title:'送10元'},
])
const gobalan=()=>{
  uni.navigateTo({
    url:'/pages/Wallet/balancedetails/balancedetails'
  })
}
</script>

<style scoped lang="scss">
@import url(./mywallet.css);
</style>
